<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name=" apple-mobile-web-app-capable" />
    <!-- 隐藏状态栏  -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <!-- <title>KTV详情页</title> -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/details.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/swiper3.07.min.css">
</head>

<body class="ng-cloak" ng-app="CheerHiWx" ng-controller="ShopDetailsCtrl">
    <header>
        <div class="wrapper clearfix">
            <div class="detail_fl fl">
                <a href="javascript:history.back();" class=""><img src="img/srh_icon.png" alt=""></a>
            </div>
            <div class="detail_fr fr">
                <a ng-click="openmap()"><img src="img/map.png" alt=""></a>
                <a data-toggle="modal" data-target="#timepartModal2"><img src="img/tel.png" alt=""></a>
            </div>
            <h1 class="top_title" ng-bind="shopDetails.shopName"></h1>
        </div>
    </header>
    <!-- coupon -->
    <!--   <div class="coupon-viable text-center">
    <p>本店预订可使用红包</p>
  </div> -->
    <!-- KTV banner -->
    <article class="ktv_banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide" ng-repeat="img in shopDetails.imgList"><img ng-src="{{img.img}}" alt=""></div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </article>
    <div class="banner_ft">
        <div class="slidedown_btn" id="slidedown_btn"></div>
        <p>评分
            <span class="score-level">
      <b style="width: {{calcStarWidth(shopDetails.shopScore)}}px;"></b>
    </span>
        </p>
        <address>地址：{{shopDetails.addr}}</address>
        <div class="moreinfo">
            <b class="route">路线：</b>
            <b class="route_info">{{shopDetails.busRoute}}<br>
      {{shopDetails.service}}
      </b>
        </div>
    </div>

    <!-- 点餐页跳转 -->
    <!--   <div class="tofood">
    <a href="order-foodinfo.html">
      <p>去点餐<span ng-bind="foodInfo"></span></p>
    </a>
  </div> -->
  
    <h3 class="p10 font12">可预订包厢数剩余<span ng-bind="remainNum.lastCount"></span>间</h3>
    <!-- 时间 -->
    <div class="time_bg" data-toggle="modal" data-target="#timepartModal">
        <div class="wrapper">
            <h4>预订时段</h4>
            <p>{{selectedTimepart.date}}<span> {{selectedTimepart.weekday}} </span>{{selectedTimepart.timepart}}</p>

            <a href=""><i></i>修改</a>
        </div>
    </div>
    <!-- 包厢选择 -->
    <div class="book_kind clearfix">
        <ul>
            <li class="clearfix" ng-repeat="active in actsList.tableTypeList" ng-if="isShow(active.groupPriceList)">
                <div class="fl">{{active.tableType}}
                    <br><span ng-bind="active.persionCount"></span>
                </div>
                <div class="m50 clearfix">
                    <div class="clearfix" ng-repeat="price in active.groupPriceList" ng-if="price.price != 0.00">
                        <button class="fr book_btn" ng-click="orderSubmit(price.shopTablePriceId)" >预订</button>
                        <span class="f1 fl" ng-bind="price.gorup"></span>
                        <span class="f2 fr">¥{{price.price}}</span>
                    </div>
                </div>
            </li>
        </ul>
        <p class="add_info">预订说明：
            <br>
            <span>
        1. 若提前结束消费，仍将按照完整包唱时间计费。
        <br>2. 付款后您预订的包房将会为您保留至时段结束。
        <br>3. 您选择期望的房间主题，商家会根据您的需要尽量满足，请以商家最终安排为准。
        <br>4. 包厢的时段如遇商家无法安排，预订款项将退回您的付款账户。</span>
        </p>
    </div>
    <div class="rule">
        <p>
            退款规则：
            <br>
            <span style="font-size:12px;">
          1未到现场时，开唱前申请退款，全额退款
          <br>2未到现场时，开唱30分钟内申请退款，退款预定金额的80%
          <br>3开唱30分钟后申请退款，将无法退款
        </span>
        </p>
    </div>
    <div class="prise">
        <div class="title p1210">
            <h2>口碑与评价 </h2>
            <!-- <span> 2345条</span> -->
        </div>
        <div class="prise_content p1210 clearfix" ng-repeat="comment in commentList">
            <div class="hd">
                <div class="user_head">
                    <img ng-src="{{comment.userImg == '' ? 'img/head.png' : comment.userImg}}" alt="">
                </div>
                <div class="user_name">
                    <h4 ng-bind="comment.userName"></h4>
                    <span ng-bind="comment.date"></span>
                    <p>评分
                        <span class="level s{{comment.mixedScore}}">
                <i class="" ></i>
                <i class="" ></i>
                <i class="" ></i>
                <i class="" ></i>
                <i class="" ></i>
              </span>
                    </p>
                </div>
            </div>
            <div class="txt">
                <p ng-bind="comment.text"></p>
            </div>
            <div class="pic">
                <ul>
                    <li ng-if="comment.img1 != ''" ng-click="previewImg(comment.id, comment.img1)"><img ng-src="{{comment.img1}}" alt=""></li>
                    <li ng-if="comment.img2 != ''" ng-click="previewImg(comment.id, comment.img2)"><img ng-src="{{comment.img2}}" alt=""></li>
                    <li ng-if="comment.img3 != ''" ng-click="previewImg(comment.id, comment.img3)"><img ng-src="{{comment.img3}}" alt=""></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="modal fade" id="timepartModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content" id="c15-modal">
                <div class="modal-body">
                    <div class="slt">
                        <select ng-model="selectedTimepartCache.date" ng-change="renderTimeparts()">
                            <option ng-repeat="date in timeparts.modelList" value="{{date.date}}" ng-bind="date.date"></option>
                        </select>
                    </div>
                    <div class="slt">
                        <select ng-model="selectedTimepartCache.timepart">
                            <option value="暂无可选时段">请选择时段</option>

                            <!-- <option ng-repeat="date in timepartArr" value="{{date.timePart}}" ng-bind="date.timePart"></option> -->

                            <option ng-repeat="date in timepartArr" value="{{date.timePart}}" ng-bind="date.timePart"></option>

                        </select>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" ng-click="confirmTimepart()">确认</button>
                </div>
            </div>
        </div>
    </div>
    <!-- 电话 -->
    <div class="modal fade" id="timepartModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content" id="c15-modal">
                <div class="modal-body">
                    <ul>
                        <li>
                            去嗨客服: <a href="tel:4009058051" id="tel"> 4009-058-051</a>
                            <br />
                        </li>
                        <li>
                            商户电话: <a href="tel:{{shopDetails.tel}}" id="tel"> {{shopDetails.tel}}</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="serve">
        <img src="img/h.png" alt="" />
        <small>去嗨科技提供技术支持</small>
    </div>
    <!-- <script src="http://192.168.1.196:8080/remote.js?1B600A3C-C225-48B8-8952-A2ADBD995324"></script> -->
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script src="js/jquery-1.11.2.min.js"></script>
    <script src="js/angular.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/swiper3.07.min.js"></script>
    <script src="js/dateformat.js"></script>
    <script type="text/javascript" src="js/constants.js"></script>
    <script src="js/common.js"></script>
    <script src="js/details.js"></script>
</body>
<span style="display:none;"><script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1255764485'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s95.cnzz.com/z_stat.php%3Fid%3D1255764485%26show%3Dpic1' type='text/javascript'%3E%3C/script%3E"));</script></span>

<script>
    _maq.push(['_setMaq', 'details']);
</script>
</html>
</html>